<template>
  <div>
    <van-goods-action>
      <van-goods-action-icon icon="cart-o" text="购物车" @click="toCart" />
      <van-goods-action-button
        type="warning"
        text="加入购物车"
        @click="addCart"
      />
      <van-goods-action-button
        type="danger"
        text="立即购买"
        @click="onSubmit"
      />
    </van-goods-action>
  </div>
</template>

<script>
import { addCart } from "../../api/cart";
import Vue from "vue";
import { GoodsAction, GoodsActionIcon, GoodsActionButton, Toast } from "vant";
Vue.use(GoodsAction);
Vue.use(GoodsActionButton);
Vue.use(GoodsActionIcon);
Vue.use(Toast);
export default {
  data() {
    return {
      token: localStorage.getItem("token"),
      time: null,
    };
  },
  created() {},
  methods: {
    onSubmit() {
      this.addCart();
      setTimeout(() => {
        this.$router.push("/cart");
      }, 1000);
    },
    toCart() {
      this.$router.push("/cart");
    },
    addCart() {
      //判断是否登陆，如果未登录就去登陆,如果登陆了就调用接口加入购物车
      if (this.token) {
        addCart({
          userid: localStorage.getItem("userid"),
          proid: this.$route.params.proid,
          num: 1,
        }).then((data) => {
          console.log(data); //成功加到购物车
        });
        Toast.success("加入成功");
      } else {
        this.$router.push("/login");
      }
    },
  },
};
</script>

<style scoped>
</style>